<template>
  <div class="hm-son">
    <h2>我是个人信息</h2>
    <p>姓名: {{ username }} </p>
    <p>年龄: {{ age }} </p>
    <p>是否单身: {{ isSinger }} </p>
    <p>座驾: {{ car }} </p>
    <p>兴趣爱好: {{ hobbies }} </p>
  </div>
</template>

<script>
export default {
  name: 'HmSon',
  // props: ['username', 'age', 'isSinger', 'car', 'hobbies'],
  // props: {
  //   username: String,
  //   age: Number,
  //   isSinger: Boolean,
  //   car: String,
  //   hobbies: Array
  // },

  props: {
    username: {
      type: String,
      required: true
    },
    age: {
      type: Number,
      validator(value) {
        // 年龄大于18岁通过校验, 否则不通过校验
        // console.log(value)
        // 必须返回是否通过校验
        return value >= 18
      }
    },
    isSinger: {
      type: Boolean,
      default: false
    },
    car: String,
    hobbies: {
      type: Array,
      default: () => ['6666', '7777', '8888']
    }
  },
  methods: {

  }
}
</script>

<style lang="less">
.hm-son {
  width: 400px;
  height: 400px;
  border: 10px solid #000;
}
</style>
